<template>
    <div class="one bodybg" ref="one">
        <div class="head">
            <div class="nav_box justify-between">
                <div class="time_left"></div>
                <div class="title_m">大企业税源监控分析应用服务</div>
                <div class="yun_right"></div>
            </div>

            <div class="flex-row">
                <div class="minitit_l flex-row-r">
                    <a href="javascript:;" @click="go('/jsjfgkfxs')" class="minibtn bg01"><span>减税概况</span></a>
                    <a href="javascript:;" @click="go('/fpgks')" class="minibtn bg02 "><span>发票概况</span></a>
                    <a href="javascript:;" @click="go('/ones')" class="minibtn bg02 ved"><span>税收概况</span></a>
                </div>
                <div class="minitit_r flex-row">
                    <a href="javascript:;" @click="go('/twos')" class="minibtn bg03"><span>经营概况</span></a>
                    <a href="javascript:;" @click="go('/threes')" class="minibtn bg03 "><span>行业概况</span></a>
                    <a href="javascript:;" @click="go('/fours')" class="minibtn bg04"><span>区域概况</span></a>
                </div>
            </div>
        </div>

        <div class="bkmail justify-between">
            <div class="bk_le">
                <!-- 集团概况 -->
                <div class="box_con1" v-loading="loading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">
                    <div class="title"><span>企业概况</span></div>
                    <div class="conform flex-row">
                        <div class="waik">
                            <div class="onebox_tit">
                                <h2>本期收入</h2>
                                <span><b>524</b>亿元</span>
                            </div>
                            <div id="echart1-1" style="  height: 140px;">1</div>
                        </div>
                        <div class="waik">
                            <div class="onebox_tit">
                                <h2>本期全省收入</h2>
                                <span><b>1035</b>亿元</span>
                            </div>
                            <div id="echart1-2" style=" height: 140px;">2</div>
                        </div>
                        <div class="waik">
                            <div class="onebox_tit">
                                <h2>员工数量</h2>
                                <span><b>1035</b>亿元</span>
                            </div>
                            <div id="echart1-3" style=" height: 140px;">2</div>
                        </div>
                    </div>
                </div>
                <!-- 集团企业收入趋势 -->
                <div class="box_con1 zhux" v-loading="loading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">
                    <div class="title"><span>企业收入趋势</span><a class="more" @click="moremx01 = true">明细</a>
                    </div>
                    <div class="conform2">
                        <div id="echart3" style=" display: block; height: 220px;"></div>
                    </div>
                </div>
                <!-- 集团收入排名 -->
                <div class="box_con1">
                    <div class="title"><span>企业税收收入排名</span><a class="more" @click="moremx02 = true">明细</a>
                    </div>
                    <div class="conform3" v-loading="loading" element-loading-text="拼命加载中"
                        element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">
                        <ul class="conform3-list">
                            <li v-for="(item, index) in jtsrpmZbzj"><span>{{ index + 1 }}</span>{{ item.SSJTNAME }}</li>
                        </ul>
                    </div>
                </div>

            </div>

            <div class="bk_min">
                <div class="top_shuju justify-between">
                    <!-- box1 -->
                    <div class="sjbk">
                        <div class="sj_tit"><img src="@/assets/styles/img/icon_l.png">{{ form.jtlx == '11' ? '集团' : '企业'
                        }}户数
                        </div>
                        <div class="sjcon">{{ jths.JTHS ? jths.JTHS : 0 }}</div>
                    </div>
                    <!-- box2 -->
                    <div class="sjbk">
                        <div class="sj_tit"><img src="@/assets/styles/img/icon_l.png">成员企业户数</div>
                        <div class="sjcon">{{ jths.CYQYHS ? jths.CYQYHS : 0 }}</div>
                    </div>
                    <!-- box3 -->
                    <div class="sjbk">
                        <div class="sj_tit"><img src="@/assets/styles/img/icon_q.png">企业收入(万)</div>
                        <div class="sjcon">{{ jths.JTSR ? jths.JTSR : 0 }}</div>
                    </div>
                    <!-- box4 -->
                    <div class="sjbk">
                        <div class="sj_tit"><img src="@/assets/styles/img/icon_q.png">企业收入占比</div>
                        <div class="sjcon">{{ jths.JTSRZB ? jths.JTSRZB : 0 }}</div>
                    </div>

                </div>
                <div class="mapbox">
                    <div class="title">
                        河北省收入
                        <div class="mapse flex-row">
                            <div class="txtinp flex-row">
                                <span class="spansize">起止时间：</span>

                                <el-date-picker popper-class="sift-data" :append-to-body="false" class="inpcon"
                                    v-model="form.date" type="monthrange" range-separator="至" start-placeholder="起"
                                    end-placeholder="止" value-format="yyyy-MM" :default-value="form.defaultDate">
                                </el-date-picker>
                            </div>

                            <div class="txtinp flex-row">
                                <span class="spansize">企业类型：</span>

                                <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择"
                                    :popper-append-to-body="false">
                                    <el-option v-for="item in options" :key="item.value" :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </div>
                            <a href="javascript:;" class="ashw" id="gotosheng" @click="getData()">查询</a>
                        </div>

                    </div>
                    <div class="map_shuju">
                        <HeBeiMap @mapBackClick="mapBackClick" @mapCountyClick="mapCountyClick" />
                    </div>
                    <div class="chart">
                        <div class="biaoti">税收收入（万元）</div>
                        <div class="main" id="echart5" v-loading="loading" element-loading-text="拼命加载中"
                            element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">

                        </div>
                    </div>
                </div>

            </div>

            <div class="bk_le">
                <!-- 集团收入经济类型构成 -->
                <div class="box_con1 rightbg" v-loading="loading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">
                    <div class="title_r"><span>企业收入经济类型构成</span><a class="more" @click="moremx03 = true">明细</a></div>

                    <div class="conform3">
                        <div id="echart-r1" style=" display: block; height: 200px;"></div>
                    </div>
                </div>

                <!-- 收入分税种构成 -->
                <div class="box_con1 rightbg">
                    <div class="title_r"><span>收入分税种构成</span><a class="more" @click="moremx04 = true">明细</a></div>
                    <div class="conform2 flex-row">
                        <div class="waik50">
                            <div id="echart-r2" style=" height: 220px;">2</div>
                        </div>
                        <div class="waik50">
                            <div id="echart-r2-1" style=" height: 220px;">2</div>
                        </div>
                    </div>
                </div>
                <!-- 集团税负情况 -->
                <div class="box_con1 rightbg" v-loading="loading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">
                    <div class="title_r"><span>集团税负情况</span><a class="more" @click="moremx05 = true">明细</a></div>
                    <div class="conform">
                        <div class="conform3 flex-row conform3_wrap">
                            <div id="echart-r3-1" style=" width: 49%; height: 100px;">1</div>
                            <div id="echart-r3-2" style=" width: 49%; height: 100px;">2</div>
                            <div id="echart-r3-3" style=" width: 49%; height: 100px; margin-top: 10px;">2</div>
                            <div id="echart-r3-4" style=" width: 49%; height: 100px; margin-top: 10px;">2</div>
                        </div>
                    </div>
                </div>


            </div>
        </div>

        <!-- 地图 -->
        <div id="map-dialog" class="map-dialog">
            <div class="d_main">
                <div class="m_list">
                    <div class="l_item">

                        <div class="d_mainbgc" style="height: 516px;overflow:hidden">
                            <div class="title">{{ mapNsrmc }}</div>
                            <div style="height:470px;overflow-y:auto">
                                <table class="shiqutable" v-loading="maploading">
                                    <tr v-for="(item, key) in mapXzData" :key="key">
                                        <td><span>{{ item.SWJGMC }}:</span>{{ item.SE }}万元</td>
                                    </tr>

                                </table>
                            </div>

                            <!-- <div class="shiqutable" v-loading="maploading">
                                <div class="item" v-for="(item,key) in mapXzData" :key="key">
                                    <div>
                                        <span>{{item.SWJGMC}}:</span>
                                        <span>{{item.SE}}万元</span>
                                    </div>
                                </div>
                            </div> -->
                        </div>
                        <div class="d_mainbgb"></div>

                    </div>

                </div>
                <a class="m_close" href="javascript:;"
                    onclick="document.getElementById('map-dialog').style.display = 'none'"></a>
            </div>
        </div>
        <!-- 地图end -->

        <!-- 集团 -->
        <div id="zx-dialog" class="zx-dialog">
            <div class="d_main">
                <div class="d_mainbgc" style="height: 510px;overflow:hidden">
                    <div class="title">{{ pmNsrmc }}</div>
                    <div style="height:470px;overflow-y:auto">
                        <table class="shiqutable" v-loading="pmloading">
                            <tr v-for="item in pmXzData" :key="item.NSRMC">
                                <td><span>{{ item.NSRMC }}:</span>{{ item.SE }}亿元</td>
                            </tr>

                        </table>
                    </div>
                </div>
                <div class="d_mainbgb"></div>

                <a class="m_close" href="javascript:;"
                    onclick="document.getElementById('zx-dialog').style.display = 'none'"></a>
            </div>
        </div>

        <div id="zx-dialog2" class="zx-dialog">
            <div class="d_main">
                <div class="d_mainbgc" style="height: 290px;">
                    <div class="title">敬业集团有限公司</div>
                    <table class="shiqutable">
                        <tr>
                            <td><span>总部钢铁:</span>5亿</td>
                        </tr>
                        <tr>
                            <td><span>乌兰浩特钢铁:</span>4亿</td>
                        </tr>
                        <tr>
                            <td><span>英国钢铁:</span>4亿</td>
                        </tr>
                        <tr>
                            <td><span>广东敬业钢铁:</span>3亿</td>
                        </tr>
                        <tr>
                            <td><span>广东粤北钢铁:</span>3亿</td>
                        </tr>

                    </table>
                </div>
                <div class="d_mainbgb"></div>

                <a class="m_close" href="javascript:;"
                    onclick="document.getElementById('zx-dialog2').style.display = 'none'"></a>
            </div>
        </div>

        <!-- 01 -->
        <el-dialog title="企业收入趋势" :visible.sync="moremx01" width="872px" :modal-append-to-body="false">
            <div class="title">
                <div class="mapse flex-row conform3_wrap">
                    <div class="txtinp flex-row">
                        <span class="spansize">起止时间：</span>
                        <el-date-picker popper-class="sift-data" :append-to-body="false" class="inpcon"
                            v-model="form.date" type="monthrange" range-separator="至" start-placeholder="起"
                            end-placeholder="止" value-format="yyyy-MM" :default-value="form.defaultDate">
                        </el-date-picker>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">地市：</span>
                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">企业类型：</span>

                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <a href="javascript:;" class="ashw" id="gotosheng" @click="getData()">查询</a>
                </div>
            </div>
            <div class="conform">
                <div id="echart3-1" style=" display: block; height: 520px;"></div>
            </div>
        </el-dialog>
        <!-- 02 -->
        <el-dialog title="企业税收收入排名" :visible.sync="moremx02" width="872px" :modal-append-to-body="false">
            <div class="title">
                <div class="mapse flex-row conform3_wrap">
                    <div class="txtinp flex-row">
                        <span class="spansize">起止时间：</span>
                        <el-date-picker popper-class="sift-data" :append-to-body="false" class="inpcon"
                            v-model="form.date" type="monthrange" range-separator="至" start-placeholder="起"
                            end-placeholder="止" value-format="yyyy-MM" :default-value="form.defaultDate">
                        </el-date-picker>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">地市：</span>
                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">企业类型：</span>
                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">总部是否在翼：</span>
                        <el-select class="inpcon2" v-model="dialog.qysssrpm.form.sfZj" placeholder="请选择"
                            :popper-append-to-body="false">
                            <el-option v-for="item in dialog.qysssrpm.basic.sfZj" :key="item.label" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <a href="javascript:;" class="ashw" id="gotosheng" @click="getData()">查询</a>
                </div>
            </div>

            <div class="conform2 conform2m" v-loading="loading" element-loading-text="拼命加载中"
                element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.2)">

                <el-table :data="tableData" highlight-current-row style="width: 100%">
                    <el-table-column type="index" label="序号" width="50"></el-table-column>
                    <el-table-column prop="qyname" label="企业名称" width="180"></el-table-column>
                    <el-table-column prop="name" label="总部是否在冀" width="180"></el-table-column>
                    <el-table-column prop="name" label="成员企业户数" width="180"></el-table-column>
                    <el-table-column prop="name" label="税收合计" width="180"></el-table-column>
                    <el-table-column prop="name" label="增值稅" width="180"></el-table-column>
                    <el-table-column prop="name" label="消费税" width="180"></el-table-column>
                    <el-table-column prop="name" label="企业所得税" width="180"></el-table-column>
                    <el-table-column prop="name" label="资源税" width="180"></el-table-column>
                    <el-table-column prop="name" label="环保税" width="180"></el-table-column>
                    <el-table-column prop="name" label="城建维护建设税" width="180"></el-table-column>
                    <el-table-column prop="address" label="税"></el-table-column>
                </el-table>
            </div>
        </el-dialog>
        <!-- 03 -->
        <el-dialog title="企业收入经济类型构成" :visible.sync="moremx03" width="872px" :modal-append-to-body="false">
            <div class="title">
                <div class="mapse flex-row conform3_wrap">
                    <div class="txtinp flex-row">
                        <span class="spansize">起止时间：</span>
                        <el-date-picker popper-class="sift-data" :append-to-body="false" class="inpcon"
                            v-model="form.date" type="monthrange" range-separator="至" start-placeholder="起"
                            end-placeholder="止" value-format="yyyy-MM" :default-value="form.defaultDate">
                        </el-date-picker>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">地市：</span>
                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">企业类型：</span>

                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <a href="javascript:;" class="ashw" id="gotosheng" @click="getData()">查询</a>
                </div>
            </div>
            <div class="conform">
                <div id="echart-r1-1" style=" display: block; height: 520px;"></div>
            </div>
        </el-dialog>
        <!-- 04 -->
        <el-dialog title="收入分税种构成" :visible.sync="moremx04" width="872px" :modal-append-to-body="false">
            <div class="title">
                <div class="mapse flex-row conform3_wrap">
                    <div class="txtinp flex-row">
                        <span class="spansize">起止时间：</span>
                        <el-date-picker popper-class="sift-data" :append-to-body="false" class="inpcon"
                            v-model="form.date" type="monthrange" range-separator="至" start-placeholder="起"
                            end-placeholder="止" value-format="yyyy-MM" :default-value="form.defaultDate">
                        </el-date-picker>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">地市：</span>
                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">企业类型：</span>

                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <a href="javascript:;" class="ashw" id="gotosheng" @click="getData()">查询</a>
                </div>
            </div>
            <div class="conform2 flex-row">
                <div class="waik50">
                    <div id="echart-r21" style=" height: 520px;">2</div>
                </div>
                <div class="waik50">
                    <div id="echart-r2-11" style=" height: 520px;">2</div>
                </div>
            </div>
        </el-dialog>
        <!-- 05 -->
        <el-dialog title="集团税负情况" :visible.sync="moremx05" width="872px" :modal-append-to-body="false">
            <div class="title">
                <div class="mapse flex-row conform3_wrap">
                    <div class="txtinp flex-row">
                        <span class="spansize">起止时间：</span>
                        <el-date-picker popper-class="sift-data" :append-to-body="false" class="inpcon"
                            v-model="form.date" type="monthrange" range-separator="至" start-placeholder="起"
                            end-placeholder="止" value-format="yyyy-MM" :default-value="form.defaultDate">
                        </el-date-picker>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">地市：</span>
                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="txtinp flex-row">
                        <span class="spansize">企业类型：</span>

                        <el-select class="inpcon2" v-model="form.jtlx" placeholder="请选择" :popper-append-to-body="false">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <a href="javascript:;" class="ashw" id="gotosheng" @click="getData()">查询</a>
                </div>
            </div>
            <div class="conform2 flex-row conform3_wrap">
                <div id="echart-r3-11" style=" width: 49%; height: 250px;">1</div>
                <div id="echart-r3-21" style=" width: 49%; height: 250px;">2</div>
                <div id="echart-r3-31" style=" width: 49%; height: 250px; margin-top: 50px;">2</div>
                <div id="echart-r3-41" style=" width: 49%; height: 250px; margin-top: 50px;">2</div>
            </div>
        </el-dialog>

    </div>



</template>

<script>
import * as echarts from "echarts";
let china = require('./json/130000_full.json');
import 'echarts-gl'
import autofit from 'autofit.js'

import {
    querySsgk,
    ssgkJtxz,
    ssgkSwjgxz
} from '@/api/cxtj/ssgk'

import HeBeiMap from "@/components/Map/HeBeiMap/index.vue"

export default {
    data() {
        return {
            form: {
                date: [],
                qssj: '',
                jssj: '',
                jtlx: '11',
                defaultDate: []
            },
            options: [{
                value: '11',
                label: '千户集团'
            }, {
                value: '2',
                label: '省局列名'
            }, {
                value: '3',
                label: '市局列名'
            }],
            btnOption: [{
                label: '总部在冀',
                flag: true
            },
            {
                label: '不在冀',
                flag: false
            }
            ],
            bqjtsrData: {},
            jtqysrqs: [],
            jtsrpmZbzj: [],
            jtsrpmZbbzj: [],
            jtsrpmData: [],
            jths: {},
            jtSfl: [],
            jtsrjjlxgcData: [],
            qssrData: [],
            loading: false,
            pmNsrmc: '',
            pmloading: '',
            pmXzData: [],
            mapNsrmc: '',
            maploading: '',
            mapXzData: [],
            moremx01: false,
            moremx02: false,
            moremx03: false,
            moremx04: false,
            moremx05: false,
            dialog: {
                qysssrpm: {
                    basic: {
                        sfZj: [{
                            label: "是",
                            value: "Y"
                        }, {
                            label: "否",
                            value: "N"
                        }],
                        swjgDm: []
                    },
                    form: {

                    },
                    table: []
                }
            }
        }
    },
    watch: {
        async moremx01() {
            if (this.moremx01) {
                await this.$nextTick()
                this.qyjtsr2()
            }
        },
        async moremx03() {
            if (this.moremx03) {
                await this.$nextTick()
                this.jtsrjjlxgc2()
            }
        },
        async moremx04() {
            if (this.moremx04) {
                await this.$nextTick()
                await this.jtsfqk11()
                this.jtsfqk21()
            }
        },
        async moremx05() {
            if (this.moremx05) {
                await this.$nextTick()
                await this.jtsfqk31()
                await this.jtsfqk41()
                await this.jtsfqk51()
                this.jtsfqk61()
            }
        }
    },
    mounted() {
        autofit.init({
            dh: 1080,
            dw: 1920,
            el: ".bodybg",
            resize: true
        })
        var currentDate = new Date();
        var year = currentDate.getFullYear(); // 获取当前年份
        var month = (currentDate.getMonth() + 1) > 9 ? currentDate.getMonth() + 1 : '0' + (currentDate.getMonth() +
            1); // 获取当前月份（注意月份是从0开始，所以要加1）

        this.form.defaultDate = [year + '-01', year + '-' + month]
        this.form.date = [year + '-01', year + '-' + month]

        this.getData()

    },
    unmounted() {
        autofit.init()
    },
    methods: {
        mapBackClick(){
            this.qssrCountyData = []
            this.qssr()
        },
        async mapCountyClick(e) {
            let self = this
            self.mapXzData = []
            if (self.qssrData.length > 0) {
                let swjgdm = ''
                for (let i = 0; i < self.qssrData.length; i++) {
                    if (e.data.name == self.qssrData[i].SWJGMC) {
                        swjgdm = self.qssrData[i].SWJGDM
                    }
                }
                let param = {
                    swjgDm: swjgdm,
                    qssj: self.form.date.length > 0 ? self.form.date[0] : self.form.defaultDate[0],
                    jssj: self.form.date.length > 0 ? self.form.date[1] : self.form.defaultDate[1],
                    jtlx: self.form.jtlx,
                }
                self.mapNsrmc = e.data.name
                let { data } = await ssgkSwjgxz(param)

                this.qssrCountyData = data

                this.qssr()
            }
        },
        tabHandle(key) {
            console.log(key)
            // if(key ==='0'){
            //       this.btnOption[1].flag = !this.btnOption[1].flag
            // }else{
            //      this.btnOption[0].flag = !this.btnOption[0].flag
            // }
            this.btnOption[0].flag = !this.btnOption[0].flag
            this.btnOption[1].flag = !this.btnOption[1].flag
            if (key == '0') {
                this.jtsrpmData = this.jtsrpmZbzj.sort((a, b) => a.JTSR - b.JTSR)

            } else {
                this.jtsrpmData = this.jtsrpmZbbzj.sort((a, b) => a.JTSR - b.JTSR)
            }
            this.jtsrpm()
        },
        getData() {

            this.bqjtsrData = {}
            this.jtqysrqs = []
            this.jtsrpmZbzj = []
            this.jtsrpmZbbzj = []
            this.jtsrpmData = []
            this.jths = {}
            this.jtSfl = []
            this.jtsrjjlxgcData = []
            this.qssrData = []
            this.qssrCountyData = []

            this.pmNsrmc = ''
            this.pmloading = ''
            this.pmXzData = []
            this.mapNsrmc = ''
            this.maploading = ''
            this.mapXzData = []
            this.loading = true
            let param = {
                qssj: this.form.date.length > 0 ? this.form.date[0] : this.form.defaultDate[0],
                jssj: this.form.date.length > 0 ? this.form.date[1] : this.form.defaultDate[1],
                jtlx: this.form.jtlx,
            }
            querySsgk(param).then(res => {
                this.loading = false
                if (res.code == 200) {

                    //集团概况
                    this.bqjtsrData = res.data.bqjtsr
                    this.jtqysrqs = res.data.jtqysrqs
                    this.jtsrpmData = res.data.jtsrpmZbzj.sort((a, b) => a.JTSR - b.JTSR)
                    this.jtsrpmZbzj = res.data.jtsrpmZbzj
                    // arr.sort((a, b) => b.JTSR - a.JTSR)
                    this.jtsrpmZbbzj = res.data.jtsrpmZbbzj
                    this.fxList = res.data.fxList


                    this.jths = res.data.jths
                    this.jtSfl = res.data.jtSfl
                    this.jtsrjjlxgcData = res.data.jtsrjjlxgc
                    this.qssrData = res.data.jtgkdt.sort((a, b) => a.SE - b.SE)
                    this.init()
                }
            })
        },
        init() {
            this.bqjtsr()
            this.bqqbsr()
            this.bqygsl()
            this.qyjtsr()
            // this.qyjtsr2()
            //this.jtsrpm()
            this.jtsrjjlxgc()
            this.jtsfqk1()
            this.jtsfqk2()
            this.jtsfqk3()
            this.jtsfqk4()
            this.jtsfqk5()
            this.jtsfqk6()
            this.qssr()
            // this.mapChart()

        },
        bqjtsr() {
            let self = this
            let myChart = echarts.init(document.getElementById('echart1-1'));
            let option;

            const gaugeData = [{
                value: 3.2, // 值
                name: '同比增长',
                title: {
                    offsetCenter: ['0%', '20%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '-20%']
                }
            }];
            option = {
                series: [{
                    type: 'gauge',
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#1379FC' // 渐变起始颜色
                                },
                                {
                                    offset: 1,
                                    color: '#31C9F8' // 渐变结束颜色
                                },
                                ],
                            },
                            borderRadius: 6,

                        },

                    },
                    axisLine: {
                        lineStyle: {
                            width: 8,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },

                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 8

                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 8
                    },

                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);
        },
        bqqbsr() {
            let self = this
            let myChart = echarts.init(document.getElementById('echart1-2'));
            let option;
            const gaugeData = [{
                value: 3.3,
                name: '同比增长',
                title: {
                    offsetCenter: ['0%', '20%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '-20%']
                }
            }];
            option = {
                series: [{
                    type: 'gauge',
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear', // 设置渐变类型为径向渐变
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#009286' // 渐变起始颜色
                                },
                                {
                                    offset: 1,
                                    color: '#1CDDCD' // 渐变结束颜色
                                },
                                ],
                            },
                            borderRadius: 6,

                        },

                    },
                    axisLine: {
                        lineStyle: {
                            width: 8,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },

                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 8

                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 8
                    },

                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]

            };

            option && myChart.setOption(option);
        },
        bqygsl() {
            let self = this
            let myChart = echarts.init(document.getElementById('echart1-3'));
            let option;
            const gaugeData = [{
                value: 3.3,
                name: '同比增长',
                title: {
                    offsetCenter: ['0%', '20%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '-20%']
                }
            }];
            option = {
                series: [{
                    type: 'gauge',
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear', // 设置渐变类型为径向渐变
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#fff222' // 渐变起始颜色
                                },
                                {
                                    offset: 1,
                                    color: '#FFC700' // 渐变结束颜色
                                },
                                ],
                            },
                            borderRadius: 6,

                        },

                    },
                    axisLine: {
                        lineStyle: {
                            width: 8,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },

                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 8

                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 8
                    },

                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]

            };

            option && myChart.setOption(option);
        },
        qyjtsr() {
            let self = this
            let xAxisData = []
            let seriesData0 = []
            let seriesData1 = []
            for (let i = 0; i < this.jtqysrqs.length; i++) {
                xAxisData.push(this.jtqysrqs[i].NY)
                seriesData0.push(this.jtqysrqs[i].SE)
                seriesData1.push(this.jtqysrqs[i].ZZL)
            }
            let myChart = echarts.init(document.getElementById('echart3'));
            myChart.setOption({
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        crossStyle: {
                            color: '#fffffff'
                        }
                    },
                    formatter: function (params) {
                        var result = params[0].name + '<br/>';
                        params.forEach(function (item) {
                            if (item.seriesType === 'bar') {
                                result += item.seriesName + ': ' + item.value + '亿元' + '<br/>';
                            } else if (item.seriesType === 'line') {
                                result += item.seriesName + ': ' + item.value + '%' + '<br/>';
                            }
                        });
                        return result;
                    }
                },
                textStyle: {
                    color: '#ffffff' // 文字颜色
                },
                grid: {
                    top: '17%',
                    left: '1%',
                    right: '0%',
                    bottom: '0%',
                    containLabel: true
                },
                legend: {
                    data: ['税收总额', '同期增长率'],
                    textStyle: {
                        color: '#ffffff' // 文字颜色
                    },
                },
                xAxis: [{
                    type: 'category',
                    data: xAxisData,
                    axisPointer: {
                        type: 'shadow',
                    },
                    axisLabel: {
                        fontSize: 12 // 设置标签字体大小
                    }

                }],
                // yAxis: [{
                //     type: 'value',
                //     name: '单位：亿元',
                //     // min: 0,
                //     // max: 80,
                //     interval: 10,
                //     axisLabel: {
                //         formatter: '{value}'
                //     },
                //     nameTextStyle: {
                //         align: 'left', // 单位名称的对齐方式
                //         padding: [0, 0, 0, -20] // 单位名称的内边距，最后一个值可以调整位置
                //     }

                // },

                yAxis: [{
                    type: 'value',
                    name: '单位：亿元',
                    //min: 0,
                    //max: 2500,
                    //interval: 500,
                    nameTextStyle: {
                        color: '#fff'
                    },
                    // splitLine: {
                    //     lineStyle: {
                    //         color: '#6e7079'
                    //     }
                    // },
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "#fff",
                            fontSize: '12',
                        },
                    },
                },
                {
                    type: 'value',
                    name: '单位：%',
                    // min: -12,
                    // max: 12,
                    // interval: 3,
                    nameTextStyle: {
                        color: '#fff'
                    },
                    splitLine: {
                        show: false
                    },
                    //min: 0,
                    //max: 100,
                    //interval: 20,
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "#fff",
                            fontSize: '12',
                        },
                    },
                }

                ],
                series: [{

                    name: '税收总额',
                    type: 'bar',
                    barWidth: '30%',
                    itemStyle: {
                        color: {
                            type: 'linear', // 设置渐变类型为径向渐变
                            x: 0,
                            y: 1,
                            colorStops: [{
                                offset: 0,
                                color: '#1379FC' // 渐变起始颜色
                            },
                            {
                                offset: 1,
                                color: '#31C9F8' // 渐变结束颜色
                            },

                            ],
                        },
                        borderRadius: [10, 10, 0, 0],

                    },
                    data: seriesData0

                },


                {
                    name: '同期增长率',
                    type: 'line',
                    yAxisIndex: 1,
                    itemStyle: {
                        color: {
                            type: 'linear', // 设置渐变类型为径向渐变
                            x: 0,
                            y: 1,
                            colorStops: [{
                                offset: 0,
                                color: '#44D7B6' // 渐变起始颜色
                            },

                            ],
                        },
                        borderRadius: [10, 10, 0, 0],

                    },
                    tooltip: {
                        valueFormatter: function (value) {
                            return value;
                        }
                    },
                    data: seriesData1
                }
                ]
            });

        },
        qyjtsr2() {
            let self = this
            let xAxisData = []
            let seriesData0 = []
            let seriesData1 = []
            for (let i = 0; i < this.jtqysrqs.length; i++) {
                xAxisData.push(this.jtqysrqs[i].NY)
                seriesData0.push(this.jtqysrqs[i].SE)
                seriesData1.push(this.jtqysrqs[i].ZZL)
            }
            let myChart = echarts.init(document.getElementById('echart3-1'));
            myChart.setOption({
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        crossStyle: {
                            color: '#fffffff'
                        }
                    },
                    formatter: function (params) {
                        var result = params[0].name + '<br/>';
                        params.forEach(function (item) {
                            if (item.seriesType === 'bar') {
                                result += item.seriesName + ': ' + item.value + '亿元' + '<br/>';
                            } else if (item.seriesType === 'line') {
                                result += item.seriesName + ': ' + item.value + '%' + '<br/>';
                            }
                        });
                        return result;
                    }
                },
                textStyle: {
                    color: '#ffffff' // 文字颜色
                },
                grid: {
                    top: '17%',
                    left: '1%',
                    right: '0%',
                    bottom: '0%',
                    containLabel: true
                },
                legend: {
                    data: ['税收总额', '同期增长率'],
                    textStyle: {
                        color: '#ffffff' // 文字颜色
                    },
                },
                xAxis: [{
                    type: 'category',
                    data: xAxisData,
                    axisPointer: {
                        type: 'shadow',
                    },
                    axisLabel: {
                        fontSize: 12 // 设置标签字体大小
                    }

                }],
                // yAxis: [{
                //     type: 'value',
                //     name: '单位：亿元',
                //     // min: 0,
                //     // max: 80,
                //     interval: 10,
                //     axisLabel: {
                //         formatter: '{value}'
                //     },
                //     nameTextStyle: {
                //         align: 'left', // 单位名称的对齐方式
                //         padding: [0, 0, 0, -20] // 单位名称的内边距，最后一个值可以调整位置
                //     }

                // },

                yAxis: [{
                    type: 'value',
                    name: '单位：亿元',
                    //min: 0,
                    //max: 2500,
                    //interval: 500,
                    nameTextStyle: {
                        color: '#fff'
                    },
                    // splitLine: {
                    //     lineStyle: {
                    //         color: '#6e7079'
                    //     }
                    // },
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "#fff",
                            fontSize: '12',
                        },
                    },
                },
                {
                    type: 'value',
                    name: '单位：%',
                    // min: -12,
                    // max: 12,
                    // interval: 3,
                    nameTextStyle: {
                        color: '#fff'
                    },
                    splitLine: {
                        show: false
                    },
                    //min: 0,
                    //max: 100,
                    //interval: 20,
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "#fff",
                            fontSize: '12',
                        },
                    },
                }

                ],
                series: [{

                    name: '税收总额',
                    type: 'bar',
                    barWidth: '30%',
                    itemStyle: {
                        color: {
                            type: 'linear', // 设置渐变类型为径向渐变
                            x: 0,
                            y: 1,
                            colorStops: [{
                                offset: 0,
                                color: '#1379FC' // 渐变起始颜色
                            },
                            {
                                offset: 1,
                                color: '#31C9F8' // 渐变结束颜色
                            },

                            ],
                        },
                        borderRadius: [10, 10, 0, 0],

                    },
                    data: seriesData0

                },


                {
                    name: '同期增长率',
                    type: 'line',
                    yAxisIndex: 1,
                    itemStyle: {
                        color: {
                            type: 'linear', // 设置渐变类型为径向渐变
                            x: 0,
                            y: 1,
                            colorStops: [{
                                offset: 0,
                                color: '#44D7B6' // 渐变起始颜色
                            },

                            ],
                        },
                        borderRadius: [10, 10, 0, 0],

                    },
                    tooltip: {
                        valueFormatter: function (value) {
                            return value;
                        }
                    },
                    data: seriesData1
                }
                ]
            });

        },
        jtsrjjlxgc() {
            let self = this
            let newData = this.jtsrjjlxgcData.map(item => {
                return {
                    value: item.ZB,
                    name: item.DJZCLXMC
                }
            })

            let myChart = echarts.init(document.getElementById('echart-r1'));
            myChart.setOption({
                color: ["#00BFD8", "#2196F3", "#FFC700", "#FF5722", "#8BC34A", "#9C27B0"],
                graphic: [
                    // 第一个环图标题
                    {
                        type: 'text',
                        left: '22%',
                        top: '20%',
                        style: {
                            text: '户数',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 14,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    },
                    // 第二个环图标题
                    {
                        type: 'text',
                        left: '65%',
                        top: '20%',
                        style: {
                            text: '收入(亿元)',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 14,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    }
                ],
                legend: {
                    top: '1%',
                    left: 'center',
                    textStyle: {
                        color: '#ffffff'
                    }
                },
                series: [
                    // 第一个环图（2023年）
                    {
                        name: '2023年收入构成',
                        type: 'pie',
                        radius: ['30%', '45%'],
                        center: ['27%', '70%'],
                        data: [{
                            value: 42.86,
                            name: '国有'
                        },
                        {
                            value: 35.71,
                            name: '民营'
                        },
                        {
                            value: 21.43,
                            name: '外资'
                        }
                        ],
                        label: {
                            normal: {
                                show: true,
                                formatter: '{d}%',
                                textStyle: {
                                    color: '#ffffff',
                                },
                            },
                        },
                        labelLine: {
                            show: true
                        },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    },
                    // 第二个环图（2024年）
                    {
                        name: '2024年收入构成',
                        type: 'pie',
                        radius: ['30%', '45%'],
                        center: ['70%', '70%'],
                        data: [{
                            value: 38.50,
                            name: '国有'
                        },
                        {
                            value: 40.20,
                            name: '民营'
                        },
                        {
                            value: 21.30,
                            name: '外资'
                        }
                        ],
                        label: {
                            normal: {
                                show: true,
                                formatter: '{d}%',
                                textStyle: {
                                    color: '#ffffff',
                                },
                            },
                        },
                        labelLine: {
                            show: true
                        },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    },
                    // 第一个环图的中心总额（2023年）
                    {
                        type: 'pie',
                        radius: ['0%', '0%'],
                        center: ['26%', '69%'],
                        label: {
                            normal: {
                                position: 'center',
                                formatter: '总额\n100亿元', // 修改这里的数值为实际总额
                                textStyle: {
                                    color: '#FFFFFF',
                                    fontSize: 14,
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        data: [0]
                    },
                    // 第二个环图的中心总额（2024年）
                    {
                        type: 'pie',
                        radius: ['0%', '0%'],
                        center: ['70%', '69%'],
                        label: {
                            normal: {
                                position: 'center',
                                formatter: '总额\n120亿元', // 修改这里的数值为实际总额
                                textStyle: {
                                    color: '#FFFFFF',
                                    fontSize: 14,
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        data: [0]
                    }
                ]
            });

        },
        jtsrjjlxgc2() {
            let self = this
            let newData = this.jtsrjjlxgcData.map(item => {
                return {
                    value: item.ZB,
                    name: item.DJZCLXMC
                }
            })

            let myChart = echarts.init(document.getElementById('echart-r1-1'));
            myChart.setOption({
                color: ["#00BFD8", "#2196F3", "#FFC700", "#FF5722", "#8BC34A", "#9C27B0"],
                graphic: [
                    // 第一个环图标题
                    {
                        type: 'text',
                        left: '22%',
                        top: '20%',
                        style: {
                            text: '户数',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 14,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    },
                    // 第二个环图标题
                    {
                        type: 'text',
                        left: '65%',
                        top: '20%',
                        style: {
                            text: '收入(亿元)',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 14,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    }
                ],
                legend: {
                    top: '1%',
                    left: 'center',
                    textStyle: {
                        color: '#ffffff'
                    }
                },
                series: [
                    // 第一个环图（2023年）
                    {
                        name: '2023年收入构成',
                        type: 'pie',
                        radius: ['30%', '45%'],
                        center: ['27%', '70%'],
                        data: [{
                            value: 42.86,
                            name: '国有'
                        },
                        {
                            value: 35.71,
                            name: '民营'
                        },
                        {
                            value: 21.43,
                            name: '外资'
                        }
                        ],
                        label: {
                            normal: {
                                show: true,
                                formatter: '{d}%',
                                textStyle: {
                                    color: '#ffffff',
                                },
                            },
                        },
                        labelLine: {
                            show: true
                        },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    },
                    // 第二个环图（2024年）
                    {
                        name: '2024年收入构成',
                        type: 'pie',
                        radius: ['30%', '45%'],
                        center: ['70%', '70%'],
                        data: [{
                            value: 38.50,
                            name: '国有'
                        },
                        {
                            value: 40.20,
                            name: '民营'
                        },
                        {
                            value: 21.30,
                            name: '外资'
                        }
                        ],
                        label: {
                            normal: {
                                show: true,
                                formatter: '{d}%',
                                textStyle: {
                                    color: '#ffffff',
                                },
                            },
                        },
                        labelLine: {
                            show: true
                        },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    },
                    // 第一个环图的中心总额（2023年）
                    {
                        type: 'pie',
                        radius: ['0%', '0%'],
                        center: ['26%', '69%'],
                        label: {
                            normal: {
                                position: 'center',
                                formatter: '总额\n100亿元', // 修改这里的数值为实际总额
                                textStyle: {
                                    color: '#FFFFFF',
                                    fontSize: 14,
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        data: [0]
                    },
                    // 第二个环图的中心总额（2024年）
                    {
                        type: 'pie',
                        radius: ['0%', '0%'],
                        center: ['70%', '69%'],
                        label: {
                            normal: {
                                position: 'center',
                                formatter: '总额\n120亿元', // 修改这里的数值为实际总额
                                textStyle: {
                                    color: '#FFFFFF',
                                    fontSize: 14,
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        data: [0]
                    }
                ]
            });

        },
        jtsfqk1() {

            var myChart = echarts.init(document.getElementById('echart-r2'));
            myChart.setOption({
                color: ["#00BFD8", "#2196F3", "#FFC700", "#FF5722", "#8BC34A", "#9C27B0"],
                graphic: [
                    // 第一个环图标题
                    {
                        type: 'text',
                        left: '28%',
                        top: '4%',
                        style: {
                            text: '地方/中央',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 16,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    }
                ],

                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b}: {c} ({d}%)'
                },
                series: [
                    // 第一个环图（2023年）
                    {
                        name: '地方/中央',
                        type: 'pie',
                        radius: ['32%', '46%'],
                        center: ['50%', '58%'],
                        startAngle: 25,
                        data: [{
                            value: 42.86,
                            name: '中央'
                        },
                        {
                            value: 35.71,
                            name: '地方'
                        }
                        ],
                        itemStyle: {
                            borderRadius: 5,
                            borderColor: '#1E2D4C',
                            borderWidth: 2
                        },
                        label: {
                            show: true,
                            formatter: function (params) {
                                // 换行显示：名称在上，百分比在下
                                return '{b|' + params.name + '}\n{d|' + params.percent + '%}';
                            },
                            rich: {
                                b: {
                                    color: '#FFFFFF',
                                    fontSize: 12,
                                    padding: [0, 0, 2, 0], // 名称下间距调整为2
                                    display: 'block',
                                    align: 'center' // 添加居中对齐
                                },
                                d: {
                                    color: '#FFC700',
                                    fontSize: 12,
                                    fontWeight: 'bold',
                                    display: 'block',
                                    align: 'center' // 添加居中对齐
                                }
                            },
                            position: 'outside',
                            alignTo: 'none',
                            minMargin: 5,
                            edgeDistance: 5,

                        },
                        labelLine: {
                            length: 13,
                            length2: 6,
                            maxSurfaceAngle: 80
                        },
                        emphasis: {
                            scale: true,
                            scaleSize: 5
                        },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    },

                    // 第一个环图的中心总额（2023年）
                    {
                        type: 'pie',
                        radius: ['0%', '0%'],
                        center: ['50%', '58%'],
                        label: {
                            normal: {
                                position: 'center',
                                formatter: '总额\n100亿元', // 修改这里的数值为实际总额
                                textStyle: {
                                    color: '#FFFFFF',
                                    fontSize: 14,
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        data: [0]
                    },
                ]
            });
        },
        jtsfqk11() {
            var myChart = echarts.init(document.getElementById('echart-r21'));
            myChart.setOption({
                color: ["#00BFD8", "#2196F3", "#FFC700", "#FF5722", "#8BC34A", "#9C27B0"],
                graphic: [
                    // 第一个环图标题
                    {
                        type: 'text',
                        left: '28%',
                        top: '4%',
                        style: {
                            text: '地方/中央',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 16,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    }
                ],

                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b}: {c} ({d}%)'
                },
                series: [
                    // 第一个环图（2023年）
                    {
                        name: '地方/中央',
                        type: 'pie',
                        radius: ['32%', '46%'],
                        center: ['50%', '58%'],
                        startAngle: 25,
                        data: [{
                            value: 42.86,
                            name: '中央'
                        },
                        {
                            value: 35.71,
                            name: '地方'
                        }
                        ],
                        itemStyle: {
                            borderRadius: 5,
                            borderColor: '#1E2D4C',
                            borderWidth: 2
                        },
                        label: {
                            show: true,
                            formatter: function (params) {
                                // 换行显示：名称在上，百分比在下
                                return '{b|' + params.name + '}\n{d|' + params.percent + '%}';
                            },
                            rich: {
                                b: {
                                    color: '#FFFFFF',
                                    fontSize: 12,
                                    padding: [0, 0, 2, 0], // 名称下间距调整为2
                                    display: 'block',
                                    align: 'center' // 添加居中对齐
                                },
                                d: {
                                    color: '#FFC700',
                                    fontSize: 12,
                                    fontWeight: 'bold',
                                    display: 'block',
                                    align: 'center' // 添加居中对齐
                                }
                            },
                            position: 'outside',
                            alignTo: 'none',
                            minMargin: 5,
                            edgeDistance: 5,

                        },
                        labelLine: {
                            length: 13,
                            length2: 6,
                            maxSurfaceAngle: 80
                        },
                        emphasis: {
                            scale: true,
                            scaleSize: 5
                        },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    },

                    // 第一个环图的中心总额（2023年）
                    {
                        type: 'pie',
                        radius: ['0%', '0%'],
                        center: ['50%', '58%'],
                        label: {
                            normal: {
                                position: 'center',
                                formatter: '总额\n100亿元', // 修改这里的数值为实际总额
                                textStyle: {
                                    color: '#FFFFFF',
                                    fontSize: 14,
                                    fontWeight: 'bold'
                                }
                            }
                        },
                        data: [0]
                    },
                ]
            });
        },
        jtsfqk2() {
            var myChart = echarts.init(document.getElementById('echart-r2-1'));
            myChart.setOption({
                color: ["#00BFD8", "#2196F3", "#FFC700", "#FF5722", "#8BC34A", "#9C27B0"],
                graphic: [
                    //标题
                    {
                        type: 'text',
                        left: '44%',
                        top: '4%',
                        style: {
                            text: '税种',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 16,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    }
                ],

                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b}: {c} ({d}%)'
                },
                series: [{
                    name: '税种',
                    type: 'pie',
                    radius: ['32%', '46%'],
                    center: ['50%', '58%'],
                    startAngle: 25,
                    data: [{
                        value: 42.86,
                        name: '企业所得税'
                    },
                    {
                        value: 35.71,
                        name: '增值税'
                    },
                    {
                        value: 25.71,
                        name: '消费税'
                    },
                    {
                        value: 15.71,
                        name: '其他'
                    }
                    ],
                    itemStyle: {
                        borderRadius: 5,
                        borderColor: '#1E2D4C',
                        borderWidth: 2
                    },
                    label: {
                        show: true,
                        formatter: function (params) {
                            // 换行显示：名称在上，百分比在下
                            return '{b|' + params.name + '}\n{d|' + params.percent + '%}';
                        },
                        rich: {
                            b: {
                                color: '#FFFFFF',
                                fontSize: 12,
                                padding: [0, 0, 2, 0], // 名称下间距调整为2
                                display: 'block',
                                align: 'center' // 添加居中对齐
                            },
                            d: {
                                color: '#FFC700',
                                fontSize: 12,
                                fontWeight: 'bold',
                                display: 'block',
                                align: 'center' // 添加居中对齐
                            }
                        },
                        position: 'outside',
                        alignTo: 'none',
                        minMargin: 5,
                        edgeDistance: 5,

                    },
                    labelLine: {
                        length: 13,
                        length2: 6,
                        maxSurfaceAngle: 80
                    },
                    emphasis: {
                        scale: true,
                        scaleSize: 5
                    },
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                },

                // 中心总额（2023年）
                {
                    type: 'pie',
                    radius: ['0%', '0%'],
                    center: ['50%', '58%'],
                    label: {
                        normal: {
                            position: 'center',
                            formatter: '总额\n100亿元', // 修改这里的数值为实际总额
                            textStyle: {
                                color: '#FFFFFF',
                                fontSize: 14,
                                fontWeight: 'bold'
                            }
                        }
                    },
                    data: [0]
                },
                ]
            });

        },
        jtsfqk21() {
            var myChart = echarts.init(document.getElementById('echart-r2-11'));
            myChart.setOption({
                color: ["#00BFD8", "#2196F3", "#FFC700", "#FF5722", "#8BC34A", "#9C27B0"],
                graphic: [
                    //标题
                    {
                        type: 'text',
                        left: '44%',
                        top: '4%',
                        style: {
                            text: '税种',
                            textAlign: 'center',
                            fill: '#FFFFFF',
                            fontSize: 16,
                            fontWeight: 'bold',
                            width: 100,
                            whiteSpace: 'normal',
                            lineHeight: 22
                        }
                    }
                ],

                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b}: {c} ({d}%)'
                },
                series: [{
                    name: '税种',
                    type: 'pie',
                    radius: ['32%', '46%'],
                    center: ['50%', '58%'],
                    startAngle: 25,
                    data: [{
                        value: 42.86,
                        name: '企业所得税'
                    },
                    {
                        value: 35.71,
                        name: '增值税'
                    },
                    {
                        value: 25.71,
                        name: '消费税'
                    },
                    {
                        value: 15.71,
                        name: '其他'
                    }
                    ],
                    itemStyle: {
                        borderRadius: 5,
                        borderColor: '#1E2D4C',
                        borderWidth: 2
                    },
                    label: {
                        show: true,
                        formatter: function (params) {
                            // 换行显示：名称在上，百分比在下
                            return '{b|' + params.name + '}\n{d|' + params.percent + '%}';
                        },
                        rich: {
                            b: {
                                color: '#FFFFFF',
                                fontSize: 12,
                                padding: [0, 0, 2, 0], // 名称下间距调整为2
                                display: 'block',
                                align: 'center' // 添加居中对齐
                            },
                            d: {
                                color: '#FFC700',
                                fontSize: 12,
                                fontWeight: 'bold',
                                display: 'block',
                                align: 'center' // 添加居中对齐
                            }
                        },
                        position: 'outside',
                        alignTo: 'none',
                        minMargin: 5,
                        edgeDistance: 5,

                    },
                    labelLine: {
                        length: 13,
                        length2: 6,
                        maxSurfaceAngle: 80
                    },
                    emphasis: {
                        scale: true,
                        scaleSize: 5
                    },
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                },

                // 中心总额（2023年）
                {
                    type: 'pie',
                    radius: ['0%', '0%'],
                    center: ['50%', '58%'],
                    label: {
                        normal: {
                            position: 'center',
                            formatter: '总额\n100亿元', // 修改这里的数值为实际总额
                            textStyle: {
                                color: '#FFFFFF',
                                fontSize: 14,
                                fontWeight: 'bold'
                            }
                        }
                    },
                    data: [0]
                },
                ]
            });

        },
        jtsfqk3() {
            var myChart = echarts.init(document.getElementById('echart-r3-1'));
            var option;

            const gaugeData = [{
                value: 80, // 值
                name: '集团整体税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#1379FC' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 10,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);

        },
        jtsfqk31() {
            var myChart = echarts.init(document.getElementById('echart-r3-11'));
            var option;

            const gaugeData = [{
                value: 80, // 值
                name: '集团整体税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                grid: {
                    height: 450
                },
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#1379FC' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 20,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);

        },
        jtsfqk4() {
            var myChart = echarts.init(document.getElementById('echart-r3-2'));
            var option;

            const gaugeData = [{
                value: 17, // 值
                name: '增值税税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#00BFD8' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 10,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);

        },
        jtsfqk41() {
            var myChart = echarts.init(document.getElementById('echart-r3-21'));
            var option;

            const gaugeData = [{
                value: 17, // 值
                name: '增值税税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#00BFD8' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 20,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);

        },
        jtsfqk5() {
            var myChart = echarts.init(document.getElementById('echart-r3-3'));
            var option;

            const gaugeData = [{
                value: 27, // 值
                name: '企业所得税税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#FFC700' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 10,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);
        },
        jtsfqk51() {
            var myChart = echarts.init(document.getElementById('echart-r3-31'));
            var option;

            const gaugeData = [{
                value: 27, // 值
                name: '企业所得税税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#FFC700' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 20,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);
        },
        jtsfqk6() {
            var myChart = echarts.init(document.getElementById('echart-r3-4'));
            var option;

            const gaugeData = [{
                value: 37, // 值
                name: '消费税税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#FF5722' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 10,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);
        },
        jtsfqk61() {
            var myChart = echarts.init(document.getElementById('echart-r3-41'));
            var option;

            const gaugeData = [{
                value: 37, // 值
                name: '消费税税赋率',
                title: {
                    offsetCenter: ['0%', '-130%'],
                },
                detail: {
                    valueAnimation: false,
                    offsetCenter: ['0%', '0%']
                }
            }];

            option = {
                series: [{
                    type: 'gauge',
                    center: ['50%', '60%'], // 修改这里，默认是['50%','50%']
                    startAngle: 90,
                    endAngle: -270,
                    pointer: {
                        show: false
                    },
                    progress: {
                        show: true,
                        overlap: false,
                        roundCap: true,
                        clip: false,
                        itemStyle: {
                            color: {
                                type: 'linear',
                                x: 0.8,
                                y: 1,
                                colorStops: [{
                                    offset: 0,
                                    color: '#FF5722' // 渐变起始颜色
                                }],
                            },
                            borderRadius: 6,
                        },
                    },
                    axisLine: {
                        lineStyle: {
                            width: 20,
                            color: [
                                [1, '#465573'],
                            ]
                        }
                    },
                    splitLine: {
                        show: false,
                        distance: 0,
                        length: 10
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false,
                        distance: 10
                    },
                    data: gaugeData,
                    title: {
                        fontSize: 14,
                        color: '#ffffff',
                    },
                    detail: {
                        width: 60,
                        height: 24,
                        fontSize: 20,
                        color: '#ffffff',
                        borderWidth: 0,
                        formatter: '{value}%'
                    }
                }]
            };

            option && myChart.setOption(option);
        },
        qssr() {
            // qssrData
            let yAxisData = []
            let seriesData = []
            let array = this.qssrCountyData.length ? this.qssrCountyData : this.qssrData
            array.forEach(item => {
                yAxisData.push(item.SWJGMC)
                seriesData.push(item.SE)
            })
            let myChart = echarts.init(document.getElementById('echart5'));
            myChart.setOption({
                /*
                tooltip: {
                  trigger: 'axis',
                  axisPointer: {
                    type: 'shadow'
                  }
                },
                */

                textStyle: {
                    color: '#ffffff' // 文字颜色
                },
                grid: {
                    top: '0%',
                    left: '29%',
                    right: '35%',
                    bottom: '0%',
                    // containLabel: true
                },
                xAxis: {
                    type: 'value',
                    boundaryGap: [0.9, 0.04],
                    axisLine: { // 控制坐标轴线  
                        show: false // 隐藏轴线  
                    },
                    axisTick: { // 控制刻度线  
                        show: false // 隐藏刻度线  
                    },
                    splitLine: { // 控制网格线  
                        show: false // 隐藏网格线  
                    },
                    axisLabel: { // 控制坐标轴标签  
                        show: false // 
                    }
                },
                yAxis: {
                    // name: '单位：亿元',
                    // nameTextStyle: {
                    //   padding: [0, 0, 0, 780]
                    // },
                    type: 'category',
                    data: yAxisData,
                    // ['张家口市', '邢台市', '承德市', '衡水市', '秦皇岛市', '廊坊市', '沧州市', '保定市', '邯郸市', '唐山市', '石家庄市'],
                    axisLine: { // 控制坐标轴线  
                        show: false // 隐藏轴线
                    },
                    axisTick: { // 控制刻度线  
                        show: false // 隐藏刻度线  
                    },
                    splitLine: { // 控制网格线  
                        show: false // 隐藏网格线  
                    },
                    axisLabel: { // 控制坐标轴标签  
                        show: true,
                        inside: true,
                        //interval: 40, //横轴信息全部显
                        //splitNumber: 30,
                        textStyle: {
                            color: '#ffffff',
                            // verticalAlign: 'bottom',
                            fontWeight: "bold",
                            fontSize: 16,
                            align: 'right',
                            padding: [0, 0, 0, 0]
                        }
                    }
                },
                series: [{
                    name: '数值',
                    type: 'bar',
                    stack: '总量',
                    barWidth: 16, // 条形的宽度  

                    label: {
                        show: true,
                        position: 'right',
                        fontSize: 16,
                        color: "#fff",
                        padding: 10
                    },
                    itemStyle: {
                        color: new echarts.graphic.LinearGradient(1, 1, 0, 0, [{
                            offset: 0,
                            color: '#72DEFF'
                        },
                        {
                            offset: 1,
                            color: '#0C68FC'
                        }
                        ]),
                        borderRadius: [0, 10, 10, 0],
                    },
                    cursor: "default",
                    data: seriesData
                }],
            });

        },
        mapChart() {
            let self = this

            echarts.registerMap('china', china);
            var chart = echarts.init(document.getElementById('map'));

            chart.setOption({
                series: [{
                    type: 'map3D',
                    map: 'china',
                    top: '-30%', // 顶部的空间大小
                    bottom: '-8%', // 底部的空间大小
                    left: '-40%', // 左侧的空间大小
                    right: '-30%', // 右侧的空间大小
                    itemStyle: {
                        color: 'rgba(21, 46, 171, 0.5)',
                        opacity: 1, // 图形的不透明度 [ default: 1 ]
                        borderWidth: 1, // (地图板块间的分隔线)图形描边的宽度。加上描边后可以更清晰的区分每个区域   [ default: 0 ]
                        borderColor: "#9AB4FF", // 图形描边的颜色。[ default: #333 ]
                    },

                    label: {
                        // 标签的相关设置
                        show: true, // (地图上的城市名称)是否显示标签 [ default: false ]
                        // formatter: function (params) {
                        //   return params.name ? params.name : " ";
                        // },
                        position: "bottom",
                        textStyle: {
                            // 标签的字体样式
                            color: "#fff", // 地图初始化区域字体颜色
                            fontSize: 12, // 字体大小
                            opacity: 1,
                        },
                    },

                    /*
                    emphasis: {
                      // 鼠标 hover 高亮时图形和标签的样式 (当鼠标放上去时  label和itemStyle 的样式)
                      label: {
                        // label 高亮时的配置
                        show: true,
                        textStyle: {
                          color: "#fff", // 高亮时标签颜色变为 白色
                          fontSize: 15, // 高亮时标签字体 变大
                        },
                      },
                      itemStyle: {
                        // itemStyle 高亮时的配置
                        areaColor: "#66ffff", // 高亮时地图板块颜色改变
                      },
                    },
                    */
                    groundPlane: {
                        // 地面可以让整个组件有个“摆放”的地方，从而使整个场景看起来更真实，更有模型感。
                        show: false, // 是否显示地面。[ default: false ]
                        color: "#aaa", // 地面颜色。[ default: '#aaa' ]
                    },
                    light: {
                        // 光照相关的设置。在 shading 为 'color' 的时候无效。  光照的设置会影响到组件以及组件所在坐标系上的所有图表。合理的光照设置能够让整个场景的明暗变得更丰富，更有层次。
                        main: {
                            // 场景主光源的设置，在 globe 组件中就是太阳光。
                            color: "#3D94CE", // 主光源的颜色。[ default: #fff ]
                            intensity: 2, // 主光源的强度。[ default: 1 ]
                            shadow: false, // 主光源是否投射阴影。默认关闭。    开启阴影可以给场景带来更真实和有层次的光照效果。但是同时也会增加程序的运行开销。
                            shadowQuality: 'high', // 阴影的质量。可选'low', 'medium', 'high', 'ultra' [ default: 'medium' ]
                            alpha: 30, // 主光源绕 x 轴，即上下旋转的角度。配合 beta 控制光源的方向。[ default: 40 ]
                            beta: 80, // 主光源绕 y 轴，即左右旋转的角度。[ default: 40 ]
                        },
                        ambient: {
                            // 全局的环境光设置。
                            color: "#fff", // 环境光的颜色。[ default: #fff ]
                            intensity: 0.5, // 环境光的强度。[ default: 0.2 ]
                        },
                    },

                    viewControl: {
                        // 用于鼠标的旋转，缩放等视角控制。
                        projection: "perspective", // 投影方式，默认为透视投影'perspective'，也支持设置为正交投影'orthographic'。
                        autoRotate: false, // 是否开启视角绕物体的自动旋转查看。[ default: false ]
                        autoRotateDirection: "cw", // 物体自传的方向。默认是 'cw' 也就是从上往下看是顺时针方向，也可以取 'ccw'，既从上往下看为逆时针方向。
                        autoRotateSpeed: 10, // 物体自传的速度。单位为角度 / 秒，默认为10 ，也就是36秒转一圈。
                        autoRotateAfterStill: 3, // 在鼠标静止操作后恢复自动旋转的时间间隔。在开启 autoRotate 后有效。[ default: 3 ]
                        damping: 0, // 鼠标进行旋转，缩放等操作时的迟滞因子，在大于等于 1 的时候鼠标在停止操作后，视角仍会因为一定的惯性继续运动（旋转和缩放）。[ default: 0.8 ]
                        rotateSensitivity: 1, // 旋转操作的灵敏度，值越大越灵敏。支持使用数组分别设置横向和纵向的旋转灵敏度。默认为1, 设置为0后无法旋转。	rotateSensitivity: [1, 0]——只能横向旋转； rotateSensitivity: [0, 1]——只能纵向旋转。
                        zoomSensitivity: 1, // 缩放操作的灵敏度，值越大越灵敏。默认为1,设置为0后无法缩放。
                        panSensitivity: 1, // 平移操作的灵敏度，值越大越灵敏。默认为1,设置为0后无法平移。支持使用数组分别设置横向和纵向的平移灵敏度
                        panMouseButton: "left", // 平移操作使用的鼠标按键，支持：'left' 鼠标左键（默认）;'middle' 鼠标中键 ;'right' 鼠标右键(注意：如果设置为鼠标右键则会阻止默认的右键菜单。)
                        rotateMouseButton: "left", // 旋转操作使用的鼠标按键，支持：'left' 鼠标左键;'middle' 鼠标中键（默认）;'right' 鼠标右键(注意：如果设置为鼠标右键则会阻止默认的右键菜单。)
                        distance: 160, // [ default: 100 ] 默认视角距离主体的距离，对于 grid3D 和 geo3D 等其它组件来说是距离中心原点的距离,对于 globe 来说是距离地球表面的距离。在 projection 为'perspective'的时候有效。
                        minDistance: 30, // [ default: 40 ] 视角通过鼠标控制能拉近到主体的最小距离。在 projection 为'perspective'的时候有效。
                        maxDistance: 400, // [ default: 400 ] 视角通过鼠标控制能拉远到主体的最大距离。在 projection 为'perspective'的时候有效。
                        alpha: 40, // 视角绕 x 轴，即上下旋转的角度。配合 beta 可以控制视角的方向。[ default: 40 ]
                        beta: -3, // 视角绕 y 轴，即左右旋转的角度。[ default: 0 ]
                        minAlpha: -360, // 上下旋转的最小 alpha 值。即视角能旋转到达最上面的角度。[ default: 5 ]
                        maxAlpha: 360, // 上下旋转的最大 alpha 值。即视角能旋转到达最下面的角度。[ default: 90 ]
                        minBeta: -360, // 左右旋转的最小 beta 值。即视角能旋转到达最左的角度。[ default: -80 ]
                        maxBeta: 360, // 左右旋转的最大 beta 值。即视角能旋转到达最右的角度。[ default: 80 ]
                        center: [0, 0, 0], // 视角中心点，旋转也会围绕这个中心点旋转，默认为[0,0,0]。
                        animation: true, // 是否开启动画。[ default: true ]
                        animationDurationUpdate: 1000, // 过渡动画的时长。[ default: 1000 ]
                        animationEasingUpdate: "cubicInOut", // 过渡动画的缓动效果。[ default: cubicInOut ]
                    },

                }]
            });
            // self.qssrData.map(item=>{
            //     return {
            //         name:item.SWJGMC,
            //         value:item.SE,
            //         swjgdm:item.SWJGDM
            //     }
            // })
            chart.off('click');
            chart.on("click", (e) => {
                console.log(e)
                self.mapXzData = []
                if (self.qssrData.length > 0) {
                    let swjgdm = ''
                    for (let i = 0; i < self.qssrData.length; i++) {
                        if (e.data.name == self.qssrData[i].SWJGMC) {
                            swjgdm = self.qssrData[i].SWJGDM
                        }
                    }
                    let param = {
                        swjgDm: swjgdm,
                        qssj: self.form.date.length > 0 ? self.form.date[0] : self.form.defaultDate[0],
                        jssj: self.form.date.length > 0 ? self.form.date[1] : self.form.defaultDate[1],
                        jtlx: self.form.jtlx,
                    }
                    self.maploading = true
                    self.mapNsrmc = e.data.name
                    ssgkSwjgxz(param).then(res => {
                        self.maploading = false
                        if (res.code == 200) {
                            console.log(res)
                            self.mapXzData = res.data
                        }
                    })
                    console.log(swjgdm)
                    let dialog = document.getElementById('map-dialog')
                    dialog.style.display = 'flex'
                }

            })
        },
        go(name) {
            this.$router.push(name)
        },

    },
    components: {
        HeBeiMap
    }
}
</script>

<style lang="scss" scoped>
@import '~@/assets/styles/css/common.css';
@import '~@/assets/styles/css/index.css';
@import '~@/assets/styles/css/jquery-ui.css';

::v-deep {
    .el-range-input {
        color: #fff;
    }

    .el-input__inner {
        border: none;
        color: #fff;
        background: transparent;
    }

    .el-select-dropdown {
        background-color: #1f3680;
        border: 1px solid #1f92ff !important;
        border-radius: 3px;
    }

    // border: 1px solid #003eff;
    // background: #007fff;
    // font-weight: normal;
    .el-select-dropdown__item {
        color: #fff;

        &.selected {
            color: #003eff;
        }

        &.hover {
            background: #007fff;
        }
    }

    .el-picker-panel {
        background-color: #1f3680;
    }

    .el-month-table td.in-range div,
    .el-month-table td.in-range div:hover {
        background-color: #007fff;
        color: #fff;
    }

    //     .el-month-table td.end-date div, .el-month-table td.start-date div {
    //       color:#007fff;
    // }
    .el-date-table td.in-range div,
    .el-date-table td.in-range div:hover,
    .el-date-table.is-week-mode .el-date-table__row.current div,
    .el-date-table.is-week-mode .el-date-table__row:hover div {
        background-color: #007fff;
        color: #fff;
    }

    .el-date-table th,
    .el-picker-panel__icon-btn {
        color: #fff;
    }

    .el-date-table td.today span {
        color: #003eff;
    }

    .el-month-table td .cell {
        color: #fff;
    }

    .el-month-table td.today .cell {
        color: #003eff;
    }

    .el-date-range-picker__header div {
        color: #fff;
    }

    .el-popper[x-placement^='bottom'] .popper__arrow {
        border-bottom-color: #1f3680;

        &::after {
            border-bottom-color: #1f3680;
        }
    }
}
</style>